@import '../../common/public.css';
@import '../../components/privatenumber/privatenumber.css'; /* pages/skin2/index.wxss */
page {
    background-color: #f5f5f5;
}
.fn-clear:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: ' ';
    clear: both;
    height: 0;
}
.pageBox {
    background: #f5f5f5;
    overflow-x: hidden;
}

.pageContainer {
    padding-bottom: calc(100rpx + constant(safe-area-inset-bottom));
    padding-bottom: calc(100rpx + env(safe-area-inset-bottom));
    box-sizing: border-box;
}
.placeholdeTop {
    height: 88rpx;
}

/* 幻灯 */
.advSwiperBox {
    width: 100%;
    background-color: #f5f5f5;
    position: relative;
}
.advSwiperBox swiper {
    height: 310rpx;
}
.advSwiperBox .swiper-item{position: relative;}
.advSwiperBox .swiper-item .picAdv {
    display: block;
    width: 100%;
    height: 310rpx;
}

.advSwiperBox .pagination {
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 6rpx;
}
.advSwiperBox .pagination .pagination-bullets {
    width: 10rpx;
    height: 6rpx;
    background: rgba(255, 255, 255, 0.5);
    display: inline-block;
    margin: 0 5rpx;
    border-radius: 6rpx;
    transition: all 0.4s ease-in-out;
}
.advSwiperBox .pagination .pagination-bullets.active {
    background: #fff;
    width: 20rpx;
}

/* 导航轮播 */
.swiper-container {
    padding: 20rpx 20rpx 10rpx;
    position: relative;
    background: #fff;
}
.swiper-container swiper {
    height: 320rpx;
}
/* .swiper-container swiper-item{height: auto !important;} */
.swiper-container .navBox {
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.swiper-container .navBox.fn-clear::after {
    content: '';
    display: block;
    clear: both;
    height: 1rpx;
}
.swiper-container .navBox button{
	margin: 0;
	line-height: normal;
	padding: 0 0 15rpx 0;
	background-color: transparent;
}
.swiper-container .navBox button::after{content: '';display: none;}
.swiper-container .nav {
    width: 20%;
    float: left;
    text-align: center;
    padding-bottom: 15rpx;
}
.swiper-container .nav:active {
    background: #f2f2f2;
    border-radius: 4rpx;
}
.swiper-container .nav .icon-circle {
    display: block;
    margin: 0 auto;
    padding-top: 10rpx;
    padding-bottom: 2rpx;
}
.swiper-container .nav .icon-circle image {
    width: 90rpx;
    height: 90rpx;
    margin: auto;
    border-radius: 50%;
}
.swiper-container .nav .icon-txt {
    font-size: 24rpx;
    color: #131626;
    height: 28rpx;
    line-height: 32rpx;
    margin-top: 5rpx;
}

.swiper-container .pagination {
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
.swiper-container .pagination .pagination-bullets {
    width: 14rpx;
    height: 14rpx;
    background: #dfe1e8;
    display: inline-block;
    margin: 0 6rpx;
    border-radius: 50%;
}
.swiper-container .pagination .pagination-bullets.active {
    background: #ff5908;
}

/* 签到 */
.qiandaoAdv {
    background: #f5f5f5;
    overflow: hidden;
	position: relative;
}
.qiandaoAdv .picAdv {
    width: 100%;
    height: 160rpx;
    background: #fff;
    display: block;
}

.bgBox {
    position: relative;
}
.bg_white {
    display: block;
    height: 286rpx;
    background: linear-gradient(0deg, #f5f5f7 0%, #ffffff 100%);
    width: 100%;
    position: absolute;
    top: 0;
    transform: translateY(-100rpx);
}
.shopCon {
    margin: 0 20rpx;
    border-radius: 20rpx;
    background: linear-gradient(0deg, #ffffff 0%, #fae9e9 100%);
    height: 270rpx;
    margin-top: 20rpx;
}
.shopCon .shopHead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24rpx;
    height: 80rpx;
}
.shopCon .shopHead .h2 {
    font-weight: bold;
    font-size: 36rpx;
    color: #222;
    display: flex;
    align-items: center;
    width: 100%;
}
.shopCon .shopHead .h2 .textShow {
    font-size: 24rpx;
    color: #978b8b;
    width: 60%;
    height: 38rpx;
    overflow: hidden;
    font-weight: normal;
    margin-left: 16rpx;
    line-height: 38rpx;
}
.shopCon .shopHead .h2 .textShow swiper {
    height: 38rpx;
}
.shopCon .more_btn {
    font-size: 26rpx;
    color: #ff4a49;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.shopCon .more_btn image {
    width: 30rpx;
    height: 30rpx;
    display: block;
    margin-left: 2rpx;
}

.proListBox {
    padding-top: 20rpx;
}
.proListBox swiper {
    height: 130rpx;
}
.proListBox .proShow {
    width: 50%;
    overflow: hidden;
}

.proListBox .pro {
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding-left: 26rpx;
    padding-right: 8rpx;
}
.proListBox .pro:nth-child(2) {
    padding-right: 30rpx;
}
.proListBox .pro_img {
    width: 130rpx;
    height: 130rpx;
    border-radius: 10rpx;
    background: #fff;
    float: left;
    margin-right: 10rpx;
    position: relative;
}
.proListBox .pro_img image {
    display: block;
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 10rpx;
}
.proListBox .pro_img .inverstory {
    position: absolute;
    left: 0;
    bottom: 0;
    background: linear-gradient(90deg, #ff4a49 0%, rgb(255, 119, 119) 100%);
    color: #fff;
    font-size: 22rpx;
    line-height: 32rpx;
    border-radius: 0 8rpx 0 10rpx;
    padding: 0 10rpx;
}
.proListBox .pro_info .pro_title {
    font-size: 24rpx;
    line-height: 28rpx;
    color: #222;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    height: 54rpx;
    font-weight: bold;
}
.proListBox .pro_info .pro_limit {
    font-size: 22rpx;
    color: #9a9ca6;
    margin-top: 6rpx;
    height: 24rpx;
}
.proListBox .pro_info .pro_price {
    line-height: 1.3em;
}
.proListBox .pro_info .pro_price .currprice {
    display: inline-block;
    font-size: 26rpx;
    color: #ec3628;
    margin-top: 6rpx;
}
.proListBox .pro_info .pro_price .currprice .int {
    font-size: 36rpx;
    font-family: moneyNumber;
}
.proListBox .pro_info .pro_price .currprice .float {
    font-size: 28rpx;
    font-family: moneyNumber;
}
.proListBox .pro_info .pro_price .oprice {
    font-size: 22rpx;
    color: #a6a8b3;
    text-decoration: line-through;
    margin-left: 12rpx;
}

.pageContainer .relative {
    position: relative;
    z-index: 2;
}
.shopCon .shopHead .timeOff {
    color: #ff4a49;
    font-size: 28rpx;
    line-height: 34rpx;
}
.shopCon .shopHead .timeOff text {
    display: inline-block;
    width: 34rpx;
    height: 34rpx;
    color: #fff;
    font-size: 24rpx;
    border-radius: 4rpx;
    background-color: #ff4a49;
    line-height: 36rpx;
    margin: 0 6rpx;
    text-align: center;
}

.advBox {
    margin: 20rpx 20rpx 0;
}
/*  display: flex; flex-wrap: wrap; justify-content: space-between; */
.advBox .advImg:first-child {
    width: 510rpx;
    height: 286rpx;
    border-radius: 10rpx;
    float: left;
}
.advBox .advImg {
    width: 184rpx;
    height: 132rpx;
    border-radius: 10rpx;
    flex-shrink: 0;
    float: right;
    margin-bottom: 22rpx;
	position: relative;
}
.advBox .advImg:last-child {
    align-self: flex-end;
}
.advBox .advImg .picAdv {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10rpx;
}

/* 分类信息相关 */
.infoContainer {
    padding-top: 20rpx;
}
.fixedBox .typeListBox {
    display: flex;
    justify-content: space-between;
    padding-right: 20rpx;
    align-items: center;
}
.fixedBox.fixedTop .typeListBox {
    margin-top: 18rpx;
}
.fixedBox .typeList {
    display: flex;
    align-items: flex-end;
    padding-left: 24rpx;
}
.fixedBox .typeList .li {
    font-size: 30rpx;
    color: #222;
    margin-right: 42rpx;
    transition: font-szie 0.2s;
    padding-bottom: 10rpx;
    position: relative;
    white-space: nowrap;
}
.fixedBox .typeList .li:last-of-type {
    margin-right: 0;
}
.fixedBox .typeList .li.on_chose {
    font-size: 42rpx;
    font-weight: bold;
    margin-right: 30rpx;
}
.fixedBox .typeList .li.on_chose::after {
    content: '';
    display: block;
    width: 30rpx;
    height: 8rpx;
    border-radius: 4rpx;
    background-color: #ff5908;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -6rpx;
}
.fixedBox .typeListBox .moreBtn {
    width: 48rpx;
    height: 48rpx;
    float: right;
    flex-shrink: 0;
    position: relative;
}
.fixedBox .typeListBox .moreBtn image {
    display: block;
    width: 100%;
    height: 100%;
}
/* .fixedBox .typeList .line{display: block; width: 30rpx; height: 8rpx; border-radius: 4rpx; background-color: #FF5908; position: absolute; bottom: 0; left: 0; transform: translateX(0); transition: transform .3s;} */
.fixedBox .typeDetailBox {
    margin-top: 30rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding-right: 20rpx;
}
.fixedBox .typeDetailBox .ul {
    white-space: nowrap;
    padding-left: 20rpx;
    width: 400rpx;
}
.fixedBox .typeDetailBox .left_type {
    font-size: 26rpx;
    color: #292a33;
    position: relative;
    width: 100%;
}
.fixedBox .typeDetailBox .left_type .ulBox {
    overflow: auto;
    width: 100%;
}
.fixedBox .typeDetailBox .left_type::after {
    content: '';
    display: block;
    width: 60rpx;
    height: 60rpx;
    background: linear-gradient(90deg, rgba(245, 245, 247, 0) 0%, #f5f5f7 100%);
    position: absolute;
    right: 0;
    top: 0;
    pointer-events: none;
}
.fixedTop.fixedBox .typeDetailBox .left_type::after {
    background: linear-gradient(90deg, rgba(245, 245, 247, 0) 0%, #fff 100%);
}
.fixedBox .typeDetailBox .left_type .span {
    height: 56rpx;
    border-radius: 10rpx;
    background-color: #fff;
    padding: 0 22rpx;
    line-height: 56rpx;
    margin-right: 12rpx;
    display: inline-block;
}
.fixedBox .typeDetailBox .left_type .span.active {
    background-color: #fff0e0;
    color: #f27b0c;
}
.fixedBox .typeDetailBox .ulBox::-webkit-scrollbar {
    display: none;
}
.fixedBox .typeDetailBox .right_shai {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    margin-left: 25rpx;
    position: relative;
}
.fixedBox .typeDetailBox .right_shai .label {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #292a33;
    font-size: 26rpx;
    height: 56rpx;
    border-radius: 10rpx;
    padding: 0 4rpx 0 14rpx;
    background-color: #fff;
}
.fixedBox .typeDetailBox .right_shai .label:first-child {
    margin-right: 12rpx;
}
.fixedBox .typeDetailBox .right_shai .label .icon {
    width: 30rpx;
    height: 30rpx;
    margin-left: 4rpx;
}
.fixedBox .typeDetailBox .right_shai .label .icon image {
    width: 100%;
    height: 100%;
    display: block;
}

.popMask {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9;
    display: none;
}
.popMask.show {
    display: block;
}
.pop.show {
    transform: translateY(0%);
	z-index: 9;
}
.pop {
    max-height: 71vh;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    border-radius: 40rpx 40rpx 0 0;
    transform: translateY(100%);
    transition: transform 0.3s;
    box-sizing: border-box;
    padding-bottom: calc(160rpx + constant(safe-area-inset-bottom));
    padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
    box-sizing: border-box;
}

.btnsGroup {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30rpx;
    position: absolute;
    left: 0;
    right: 0;
    padding-bottom: calc(20rpx + constant(safe-area-inset-bottom));
    padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
    background: #fff;
    bottom: 0;
}
.btnsGroup .a {
    display: block;
    height: 80rpx;
    border-radius: 40rpx;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30rpx;
    font-weight: bold;
    box-sizing: border-box;
}
.btnsGroup .a.reset_btn {
    border: solid 1px #e6e6e6;
    color: #131626;
    width: 260rpx;
}
.btnsGroup .a.confirm_btn {
    background: #183359;
    color: #fff;
    width: 400rpx;
}

.pop .dl {
    margin: 0 10rpx 0 30rpx;
    margin-top: 66rpx;
}
.pop .dl .dt {
    font-size: 32rpx;
    color: #131626;
    font-weight: bold;
}
/* .pop  .dd{max-height: 1.76rem; overflow: hidden; position: relative;}
.pop  .dd.open{ max-height: none !important;overflow: visible;} */
.pop .dd {
    margin: 24rpx 0;
    max-height: 52vh;
    overflow-y: auto;
}
.pop .li {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 64rpx;
    border-radius: 32rpx;
    background: #f5f5f7;
    color: #17171a;
    font-size: 24rpx;
    float: left;
    margin-right: 16rpx;
    min-width: 140rpx;
    text-align: center;
    margin-bottom: 24rpx;
    min-width: 112rpx;
    padding: 0 24rpx;
}
.pop .li.on_chose {
    color: #f27b0c;
    font-weight: bold;
    background: #fff6ed;
}

/* 列表 */
.infoListBox {
    margin-top: 20rpx;
}
.infoListBox .li {
    margin: 0 20rpx 20rpx;
    background-color: #fff;
    border-radius: 30rpx;
    padding: 25rpx;
    position: relative;
}
.infoListBox .li .isTop {
    width: 63rpx;
    height: 63rpx;
    position: absolute;
    left: 0;
    top: 0;
}
.infoListBox .li .isTop image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.infoListBox .li.visited .h2 {
    opacity: 0.5;
}
.infoListBox .li .h2 {
    font-size: 32rpx;
    color: #202021;
    font-weight: 900;
    line-height: 42rpx;
}
/* .infoListBox .li .h2.normal{font-weight: normal;} */
.infoListBox .li .h2 text {
    color: #3d81ff;
    font-size: 26rpx;
    margin-left: 4rpx;
    font-weight: normal;
}
.infoListBox .li .h2 .more {
    display: inline;
}
.infoListBox .li .con .more {
    display: inline;
}
.infoListBox .li .con .more text {
    color: #3d81ff;
}
.infoListBox .li .infoDetail {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20rpx;
}
.infoListBox .li .infoDetail .pubdate,
.infoListBox .li .infoother .infoRead {
    color: #adaeb3;
    font-size: 24rpx;
}
.infoListBox .li .shoucang {
    color: #313233;
    font-size: 26rpx;
    margin-left: 24rpx;
    display: flex;
    align-items: center;
}
.infoListBox .li .shoucang .icon {
    display: block;
    width: 26rpx;
    height: 26rpx;
    margin-right: 6rpx;
}
.infoListBox .li .icon image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.infoListBox .li .infoother {
    display: flex;
    align-items: center;
}

.infoListBox .otherStyle .infoother {
    margin-top: -30rpx;
}
/* .infoListBox .otherStyle .infoother .infoRead {color: #313233;} */

.infoListBox .li .infoLabels {
    display: flex;
    align-items: center;
    margin-top: 20rpx;
    flex-wrap: wrap;
}
.infoListBox .li .infoLabels .ilab {
    line-height: 44rpx;
    padding: 0 16rpx;
    background-color: #f0f8ff;
    color: #616d8b;
    font-size: 26rpx;
    margin-right: 10rpx;
    border-radius: 6rpx;
    white-space: nowrap;
    margin-bottom: 10rpx;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
.infoListBox .li .infoLabels .ilab.bold {
    background-color: #e1faf1;
    color: #54b391;
    font-weight: bold;
}
.infoListBox .li .infoOpt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 40rpx;
}
.infoListBox .li .infoOpt .btnGroup {
    display: flex;
    align-items: center;
    font-size: 26rpx;
    font-weight: bold;
}
.infoListBox .li .infoOpt .btnGroup .btn {
    display: flex;
    align-items: center;
    margin-right: 10rpx;
    font-size: 26rpx;
    height: 60rpx;
    border-radius: 30rpx;
    padding: 0 24rpx;
    border: 1rpx solid #e6e6e6;
    box-sizing: border-box;
}
.infoListBox .li .infoOpt .btnGroup .btn::after {
    display: none;
}
.infoListBox .li .infoOpt .btnGroup .btn.btn_call {
    background: linear-gradient(90deg, #ff6f08 0%, #fa3425 100%);
    border: none;
    color: #fff;
    padding-left: 20rpx;
    padding-right: 34rpx;
}
.infoListBox .li .infoOpt .btnGroup .btn.btn_share {
    background: none;
    color: #636366;
    font-weight: normal;
    font-size: 26rpx;
}
.infoListBox .li .infoOpt .btnGroup .btn .icon {
    width: 32rpx;
    height: 32rpx;
    margin-right: 6rpx;
}

.posi .icon {
    width: 28rpx;
    height: 28rpx;
    margin-left: 8rpx;
}
.posi {
    font-size: 26rpx;
    color: #636366;
    display: flex;
    align-items: center;
}
.otherStyle .posi {
    text-align: right;
    display: block;
    margin-top: -20rpx;
}
.otherStyle .posi .icon {
    display: inline-block;
    vertical-align: middle;
    margin-top: -6rpx;
}

.infoListBox .li .picsBox {
    margin-top: 20rpx;
}
.infoListBox .li .picsBox .pic {
    width: 210rpx;
    height: 158rpx;
    border-radius: 10rpx;
    margin-right: 10rpx;
    background-color: #f4f4f4;
    float: left;
    position: relative;
}
.infoListBox .li .picsBox .pic .videoIcon {
    width: 60rpx;
    height: 60rpx;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}
.infoListBox .li .picsBox image {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 10rpx;
}
.imgMask {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    font-size: 28rpx;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    border-radius: 10rpx;
}
/* style2 */
.infoListBox .li .memberInfo {
    display: flex;
    align-items: center;
}
.infoListBox .li .memberInfo .mHead {
    width: 90rpx;
    height: 90rpx;
    border-radius: 15%;
    margin-right: 20rpx;
    background-color: #f5f5f6;
}
.infoListBox .li .memberInfo .mHead image {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 15%;
}
.infoListBox .li .memberInfo .mDetail .h2 {
    font-size: 32rpx;
    color: #212121;
    font-weight: bold;
}
.infoListBox .li .memberInfo .mDetail .h2 .check {
    display: inline-block;
    font-size: 24rpx;
    color: #ababab;
    line-height: 36rpx;
    padding: 0 14rpx;
    border-radius: 6rpx;
    background-color: #f5f5f7;
    font-weight: bold;
    margin-left: 10rpx;
    vertical-align: middle;
    align-items: center;
    margin-top: -6rpx;
}
.infoListBox .li .memberInfo .mDetail .h2 .check.hasCheck {
    color: #54b391;
    background-color: #e1faf1;
}
.infoListBox .li .memberInfo .mDetail .p text {
    font-size: 24rpx;
    color: #666;
    display: inline-block;
    vertical-align: middle;
}
.infoListBox .li .memberInfo .mDetail .p .line {
    font-size: 18rpx;
    margin: 0 16rpx;
}
.infoListBox .li.otherStyle .infoLabels {
    margin-top: 26rpx;
}

.infoListBox .li .item_list {
    font-size: 30rpx;
    line-height: 42rpx;
    color: #333;
    margin-top: 20rpx;
    font-weight: 700;
}
.infoListBox .li .item_list .label {
    display: inline-block;
    color: #adaeb2;
}
.infoListBox .li .con {
    background-color: #f5f5f7;
    border-radius: 10rpx;
    padding: 20rpx 26rpx;
    color: #666770;
    line-height: 42rpx;
    font-size: 30rpx;
    margin-top: 28rpx;
    font-weight: 700;
}
.infoListBox .li .con .wxParse-div {
    font-weight: 700;
}

.infoListBox .otherStyle .item_list .p,
.infoListBox .otherStyle .item_list .label {
    color: rgba(0, 0, 0, 0.7);
}

.loading {
    margin: 40rpx auto;
    text-align: center;
    font-size: 24rpx;
    color: #999;
}
.loading image {
    width: 42rpx;
    height: 42rpx;
    animation: rotate_ 1s infinite linear;
    margin: 6rpx auto;
}
.nodata {
    width: 322rpx;
    height: 274rpx;
    color: #999;
    font-size: 24rpx;
    text-align: center;
    margin: 10rpx auto;
    padding-bottom: 50rpx;
}
.nodata image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 10rpx auto;
}

.fixedTop {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    background-color: #fff;
    z-index: 99;
    padding-bottom: 20rpx;
    box-shadow: 2rpx 2rpx 6rpx rgba(0, 0, 0, 0.1);
}
